<!DOCTYPE html>
<html lang="en">

<head>
    <title>html5</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1"> </head>

<body>
    <img id="my-image" src="./canvas-imagejpg.jpg" />
    <canvas id="canvas-img" width="250" height="300" 
        style="border:1px solid #000000;"></canvas>
    <script>
        var c = document.getElementById("canvas-img");
        var ctx = c.getContext("2d");
        var img = document.getElementById("my-image");
        img.onload = function(){
            ctx.drawImage(img, 10, 10);
        }
    </script> </body>

</html>